<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增项目')"/>
    <th:block th:include="include :: datetimepicker-css"/>
    <th:block th:include="include :: select2-css"/>
</head>
<style>
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    input[type="number"] {
        -moz-appearance: textfield;
    }
</style>
<body>
<div class="main-content">
    <form id="form-project-add" class="form-horizontal">
        <h4 class="form-header h4">基本信息</h4>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目编号：</label>
                    <div class="col-sm-6">
                        <input name="proNumber" placeholder="请输入项目编号" class="form-control" type="text"
                               readonly="readonly">
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目名称：</label>
                    <div class="col-sm-6">
                        <input name="proName" type="text" placeholder="请输入项目名称" class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">工程公司：</label>
                    <div class="col-sm-6">
                        <select id="belongComp" name="belongComp" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="belongComp : ${belongComp}" th:text="${belongComp.paramValue}"
                                    th:value="${belongComp.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">建设单位：</label>
                    <div class="col-sm-6">
                        <input name="buildCompany" type="text" placeholder="请输入建设单位名称" class="form-control">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">合同造价(万元)：</label>
                    <div class="col-sm-6">
                        <input name="contractCost" placeholder="请输入合同造价" class="form-control" type="number">
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">合同工期：</label>
                    <div class="col-sm-6">
                        <input name="contractDate" placeholder="请输入合同工期" class="form-control" type="text">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">开工时间：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control" id="startTime" placeholder="开工时间" name="startTime">
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">竣工时间：</label>
                    <div class="col-sm-6">
                        <input type="text" class="form-control" id="endTime" placeholder="竣工时间" name="endTime">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目类型：</label>
                    <div class="col-sm-6">
                        <select name="proType" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="proType : ${proType}" th:text="${proType.paramValue}"
                                    th:value="${proType.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目状态：</label>
                    <div class="col-sm-6">
                        <select name="proStatus" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="proStatus : ${proStatus}" th:text="${proStatus.paramValue}"
                                    th:value="${proStatus.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目位置：</label>
                    <div class="col-sm-6">
                        <div class="row">
                            <div class="col-sm-10" style="padding-right: 0px !important;">
                                <input name="proPosition" id="proPosition" placeholder="请输入项目位置" class="form-control"
                                       type="text">
                            </div>
                            <div class="col-sm-2" style="padding-left: 0px !important;">
                                <a class="btn btn-white" onclick="jmp()" style="width: 100%"><i
                                        class="fa fa-map-marker"></i>
                                </a>
                            </div>
                        </div>

                    </div>

                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">楼栋号：</label>
                    <div class="col-sm-6">
                        <select id="buildingIds" class="form-control select2-multiple" multiple>
                            <option th:each="building:${building}" th:value="${building.id}"
                                    th:text="${building.name}"></option>
                        </select>
                    </div>

                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">项目经理：</label>
                    <div class="col-sm-6">
                        <select name="proManagerPerson" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="proPerson : ${proPerson}" th:text="${proPerson.name}"
                                    th:value="${proPerson.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">联系电话：</label>
                    <div class="col-sm-6">
                        <input name="phone" placeholder="请输入联系电话" class="form-control" type="text" maxlength="11">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">商务负责人：</label>
                    <div class="col-sm-6">
                        <select name="businessDirector" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="businessPerson : ${businessPerson}" th:text="${businessPerson.name}"
                                    th:value="${businessPerson.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">技术负责人：</label>
                    <div class="col-sm-6">
                        <select name="technicalDirector" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="technicalPerson : ${technicalPerson}" th:text="${technicalPerson.name}"
                                    th:value="${technicalPerson.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">合同质量目标：</label>
                    <div class="col-sm-6">
                        <input name="contractQuality" placeholder="请输入合同质量目标" class="form-control" type="text">
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">合同安全文明施工目标：</label>
                    <div class="col-sm-6">
                        <input name="safetyCulture" placeholder="请输入合同安全文明施工目标" class="form-control" type="text">
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">工程规模：</label>
                    <div class="col-sm-6">
                        <textarea name="proScale" maxlength="1000" class="form-control"
                                  placeholder="请输入工程规模"></textarea>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">工程概况：</label>
                    <div class="col-sm-6">
                        <textarea name="proSynopsis" maxlength="1000" class="form-control"
                                  placeholder="请输入工程概况"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <h4 class="form-header h4">信息化信息</h4>
        <div class="row">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-3 control-label">信息化负责人：</label>
                    <div class="col-sm-6">
                        <select name="proInfoPerson" class="form-control m-b">
                            <option value="">请选择</option>
                            <option th:each="infoPerson : ${infoPerson}" th:text="${infoPerson.name}"
                                    th:value="${infoPerson.id}"></option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-xs-3 control-label">项目状态：</label>
                    <div class="col-xs-6">
                        <label class="check-box">
                            <input id="network" name="network" value="1" type="checkbox" th:text="网络">
                        </label>
                        <label class="check-box">
                            <input id="erp" name="erp" value="1" type="checkbox" th:text="ERP">
                        </label>
                        <label class="check-box">
                            <input id="attendance" name="attendance" value="1" type="checkbox" th:text="劳务考勤">
                        </label>
                        <label class="check-box">
                            <input id="monitor" name="monitor" value="1" type="checkbox" th:text="监控">
                        </label>
                        <label class="check-box">
                            <input id="devops" name="devops" value="1" type="checkbox" th:text="运维">
                        </label>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<div class="row">
    <div class="col-sm-offset-5 col-sm-10">
        <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存
        </button>&nbsp;
        <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭
        </button>
    </div>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: select2-js"/>
<th:block th:include="include :: datetimepicker-js"/>
<script>
    var prefix = ctx + "projectManage";

    $(function () {
        layui.use('laydate', function () {
            var laydate = layui.laydate;

            laydate.render({
                elem: '#startTime'
            });

            laydate.render({
                elem: '#endTime'
            });
        });
        $.ajax({
            url: prefix + '/identifier',
            type: 'POST',
            success: function (data) {
                var num = Number(data) + 1;
                num = num.toString()
                if (num.length == 1) {
                    num = 'JPJS-' + '000' + num;
                    $("input[name='proNumber']").val(num);
                }
                if (num.length == 2) {
                    num = 'JPJS-' + '00' + num;
                    $("input[name='proNumber']").val(num);
                }
                if (num.length == 3) {
                    num = 'JPJS-' + '0' + num;
                    $("input[name='proNumber']").val(num);
                }
                if (num.length == 4) {
                    num = 'JPJS-' + num;
                    $("input[name='proNumber']").val(num);
                }
            }

        })

    })

    function jmp() {
        $.modal.open('选择位置', prefix + '/map');
    }

    $("#form-project-add").validate({
        onkeyup: false,
        rules: {
            phone: {
                isPhone: true
            },
        },
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            if ($("#belongComp option:selected").val() == '') {
                $.modal.alertWarning("请选择工程公司！");
                return;
            }
            var data = $("#form-project-add").serializeArray();
            var network = $("input[id='network']").is(':checked') == true ? 1 : 0;
            var erp = $("input[id='erp']").is(':checked') == true ? 1 : 0;
            var attendance = $("input[id='attendance']").is(':checked') == true ? 1 : 0;
            var monitor = $("input[id='monitor']").is(':checked') == true ? 1 : 0;
            var devops = $("input[id='devops']").is(':checked') == true ? 1 : 0;
            var buildingIds = $.form.selectSelects("buildingIds");
            data.push({"name": "network", "value": network});
            data.push({"name": "erp", "value": erp});
            data.push({"name": "attendance", "value": attendance});
            data.push({"name": "monitor", "value": monitor});
            data.push({"name": "devops", "value": devops});
            data.push({"name": "buildingIds", "value": buildingIds});
            $.operate.saveTab(prefix + "/save", data);
        }
    }

</script>
</body>
</html>